<template>
  <div class="comments">
    <div class="mui-content">
      <div class="mui-content-padded">
        <div class="mui-inline">问题和意见</div>
        <a class="mui-pull-right mui-inline" href="#popover">
          快捷输入
          <span class="mui-icon mui-icon-arrowdown"></span>
        </a>
        <!--快捷输入具体内容，开发者可自己替换常用语-->
        <div id="popover" class="mui-popover">
          <div class="mui-popover-arrow"></div>
          <div class="mui-scroll-wrapper">
            <div class="mui-scroll">
              <ul class="mui-table-view">
                <!--仅流应用环境下显示-->
                <li class="mui-table-view-cell stream">
                  <a href="#">桌面快捷方式创建失败</a>
                </li>
                <li class="mui-table-view-cell">
                  <a href="#">界面显示错乱</a>
                </li>
                <li class="mui-table-view-cell">
                  <a href="#">启动缓慢，卡出翔了</a>
                </li>
                <li class="mui-table-view-cell">
                  <a href="#">偶发性崩溃</a>
                </li>
                <li class="mui-table-view-cell">
                  <a href="#">UI无法直视，丑哭了</a>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <div class="row mui-input-row">
        <textarea id="question" class="mui-input-clear question" placeholder="请详细描述你的问题和意见..."></textarea>
      </div>
      <p>图片(选填,提供问题截图,总大小10M以下)</p>
      <div id="image-list" class="row image-list"></div>
      <p>QQ/邮箱</p>
      <div class="mui-input-row">
        <input id="contact" type="text" class="mui-input-clear contact" placeholder="(选填,方便我们联系你 )" />
      </div>
      <div class="mui-content-padded">
        <div class="mui-inline">应用评分</div>
        <div class="icons mui-inline" style="margin-left: 6px;">
          <i data-index="1" class="mui-icon mui-icon-star"></i>
          <i data-index="2" class="mui-icon mui-icon-star"></i>
          <i data-index="3" class="mui-icon mui-icon-star"></i>
          <i data-index="4" class="mui-icon mui-icon-star"></i>
          <i data-index="5" class="mui-icon mui-icon-star"></i>
        </div>
      </div>
      <br />
    </div>
  </div>
</template>
<script type="text/javascript">
mui.init();
mui(".mui-scroll-wrapper").scroll();
</script>
<script>
export default {};
</script>
<style scoped>
.comments {
  margin-top: 40px;
}
</style>